Embedding  Viola  Applets  in  the  ToolBar 

Example:  Continuously  Incoming  Data  Monitor 
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The  above  "monitor"  applet  (the  scrolling  field  next  to  the  "reload"  button") 
maintains  a  continuous  network  connection  to  a  server  and  listens  to  a  data  stream. 

This  demonstrates  the  ability  to  construct  World  Wide  Web  documents  which 
contain  continuously  updating  fields.  Possible  applications  are  front-ends  for 
monitors  for  any  constant  updated  data,  such  as  for  stock  market  graphs,  news  wire 
information,  continuously  updating  weather  map,,,. 

How  does  this  work? 

Basically,  this  document  has  a  "tool"  type  <LINK>  to  a  script.  This  causes  viola  to 
fetch  the  script,  instantiates  the  script  (objects),  and  installs  the  object  in  the  tool  bar. 

(<LINK>  is  a  HTML  3.0  provision  for  linking  to  data  types) 

This  is  the  markup,  embedded  m  a  HTML  document,  that  makes  the  link  to  the 
applet: 

<LINK  REL="tool"    HREF="monitorBar.v"> 

And  here's  the  listing  for  the  "monitorBar.v"  applet/object/script. 

\name  {monitorBar} 


\children  {monitorBar. socket} 
\class  {field} 
\ script  { 

switch  (arg[0])  { 
case  "graph": 

/*  draw  the  latest  graph  line,  and  scroll  the  field  */ 
y  =  arg[l]  /  100.0  *  hh; 
drawLined,  y,  1,  hh)  ; 
copyArea(0,  0,  ww,  hh,  1,  0); 
return; 
break; 
case  "config": 

/*  initialization  code,  prepare  the  variables...  */ 
usual ( ) ; 
clearWindowO  ; 
WW  =  get ( "width" ) ; 
hh  =  get ( "height " ) ; 
return; 
break; 
} 

usual ( ) ; 
} 

\gapV  {2} 
\gapH  {2} 
\width  {100} 
\height  {50} 
\BGColor  {blue} 
\FGColor  {white} 
\border  '{6} 
\ 

\name  {monitorBar. socket} 
\parent  {monitorBar} 
\class  {socket} 

\host  {pebble.berkeley.ora.com} 
\port  {7777} 
\ script  { 

/*  sym  share  price 

*/ 
switch  (arg[0])  { 
case  "input": 

/*  there's  data  in  the  queue,  read  and  parse  the  data, 

*  then  relay  the  information  to  the  drawing  object 
*/ 

data  =  input () ; 

send(parent ( } ,  "graph" ,  int (nthWord{data,  3 ) ) ) ; 

return; 
break; 
case  "init": 

/*  tell  viola  to  notify  this  object  when  data  stream 

*  has  enough  useful  information  (when  there's  a 

*  carriage  return  character)  for  this  object  to 

*  read  the  input  queue. 
*/ 

usual ( ) ; 


break; 
} 
usual ( 


set ( "outDelimStr" ,  "\r\n" 
set ( "inDelimStrl" ,  '\n'); 
startClient () ; 
return; 


This  document  can  be  found  at: 

http://marble.ebay.gnn.com/proj/viola/violaGNM)emo/monitorBarDemo_out.html 
pei@gnn.com 
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Example:  Page  Voter 
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This  document  is  voteable.  You  can  vote  on  this  document  by  using  the  "Page  Voter" 
tool  that  is  in  the  toolbar. 

Once  you've  picked  (voted)  a  rating,  that  information  will  be  submited  to  a  server 
(thank  you),  and  also  saved  in  a  local  database  in  your  file  system.  The  rating 
information  is  saved  locally  so  that  the  next  time  you  visit  this  page,  you  wUl  see  if 
you  had  already  rated  the  page. 

FYI,  The  "Page  Voter"  applet  is  linked  to  this  page  using  the  following  markup.  Note 
that  same  applet  can  be  reused  by  different  pages  (only  the  'ARC  attribute  is 
changed  to  identify  the  page  being  voted  on). 

<LINK  REL="tool"    HREF="voter2.v"   ARG= "vot able 1. html "> 
And  here's  the  "voter2.v"  applet  Usting: 

\class    {vpane} 

\naine    {voter2} 

\children   {voter2 . label  vot er2 .rating} 

\ script    { 

switch    (arg[0])    { 
case    "make" : 

votingOn   =   arg[2]; 

info   =   send("ratedUrlDB" ,     "fetch",    votingOn); 

if    (info)    send( "vot er2. rating",     "setRate",    int (info[0] ) ) ; 


return; 
break; 
case  "submit": 

print  ("»»»»  SUBMIT:  doc 
arg[l],  "\n"); 


=  {",  votingOn,  "}   rating  =  ", 


HTTPGet (concat ( "http: //marble. ebay.gnn. com/cgi-bin/votepg?" , 
votingOn,  "=",  arg[l])); 

send("ratedUrlDB",  "put",  votingOn,  arg[l] ,  "description   ")• 

send ( "rat edUrlDB" ,  "flush" ) ;  • • •   ' 

return; 
break; 
} 
usual ( )  ; 

} 

\maxWidth  {100} 

\border  {6} 

\gapH  {2} 

\gapV  {2} 

\ 

\class  {txtLabel} 

\name  {voter2. label} 

\parent  {voter2} 

Mabel  {Page  Voter} 

\paneConfig  {westToEast} 

\ script  { 

switch  (arg[0])  { 

case  "hint": 

return  "Vote  on  the  doucment!"; 
break; 

case  "enter" : 
case  "leave": 

send( "www.mesg.tf",  "suggest",  self(),  arg[0]); 
break; 

} 

usual ( )  ; 
} 

\gapH  {2} 
\ 

\class  {menu} 
\parent  {voter2} 
\name  {voter2. rating} 
\menuConfig  { 

.  {Excellent}    {send(self { ) ,  "rating",  4, 
.  {Good}        {send(self 0 ,  "rating",  3, 
.  {Average}     {send(self () ,  "rating",  2, 
.  {Poor}        {send(self( 
} 

Mabel  {unrated} 
\ script  { 

switch  (arg[0])  { 

case  "rating": 

set ("label",  arg[2]); 
render ( ) ; 


"rating",  1, 


"Excellent")  ; } 
"Good") ; } 
"Average" ) 
" Poor " ) ; } 


} 


send (parent ( ) ,  " submit " ,  arg [ 1 ] )  ; 

return; 
break; 
case  "setRate" : 

,  switch  (arg[l])  { 


case  1 

case  2 

case  3 

case  4 

} 
,  render ( ) ; 

return; 
break; 
case  "hint": 

return  "Choose  a  rating 
break; 
} 
usual ( )  ; 


set ("label",  "Poor");  break 

set ( " label " ,  "Average " )  ;  break 

set ("label",  "Good");  break 

set ( "label " ,  "Excellent " ) ;  break 


} 

\border  {3} 

\gapH  {2} 

\ 


This  document  can  be  found  at: 

http://marble.ebay.gnn.com/proj/viola/violaGNNDemo/aboutVoteablePages.html 
pei@gnn.com 


